<template>
    <div class="release_success">
        <titleVue @close="close" :title="title_text"></titleVue>
        <div class="content">
            <img src="../../assets/img/success.png" alt="">
            <h2>发布成功!</h2>
            <b>记得随时关注自己的商品</b>
        </div>
        <div class="button">
            <button @click="gp_back">返回</button>
        </div>
    </div>
</template>

<script>
import titleVue from '../../common/title'

export default {
    name: 'ReleaseSuccess',
    components: {
        titleVue
    },
    data() {
        return {
            title_text: '发布成功'
        }
    },
    methods: {
        gp_back() {
            console.log('触发返回事件')
            // this.$router.push('/app/toReleaseTo')
            this.va.close()
        },
        // 关闭当前窗口
        close() {
            this.va.close()
        },
    }
}
</script>

<style scoped lang="less">
.release_success {
    .content {
        position: absolute; /* 设置为绝对定位 */
        top: 50%; /* 从顶部算起，偏移50% */
        left: 50%; /* 从左侧算起，偏移50% */
        transform: translate(-50%, -70%); /* 将元素的中心点移到左上角 */
        text-align: center;

        h2 {
            margin-top: 0.5rem;
            font-weight: 600
        }

        b {
            font-size: 14px;
        }

        img {
            width: 12rem;
            margin-left: 1.2rem;
        }
    }

    .button {
        position: fixed;
        left: 50%;
        transform: translateX(-50%);
        bottom: 1rem;

        button {
            color: #ffffff;
            background-color: #f79100;
            width: 5.8rem;
            height: 3.1rem;
            line-height: 3.1rem;
            text-align: center;
            border: none;
            letter-spacing: 0.1rem;
            border-radius: 6px;
        }
    }
}
</style>
